import 'package:dailoz/constants.dart';
import 'package:dailoz/generated/l10n.dart';
import 'package:dailoz/service/profile_page_service/profile_page_service.dart';
import 'package:dailoz/service/user_service/user_service.dart';
import 'package:dailoz/size_config.dart';
import 'package:dailoz/view_model/profile_page_view_model.dart';
import 'package:dailoz/views/settings_page.dart';
import 'package:dailoz/widgets/cupertino_popup_menu.dart';
import 'package:dailoz/widgets/label_type_group.dart';
import 'package:dailoz/widgets/progress_widget.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class ProfilePage extends StatefulWidget {
  const ProfilePage({Key? key}) : super(key: key);

  @override
  State<ProfilePage> createState() => _ProfilePageState();
}

class _ProfilePageState extends State<ProfilePage> {
  TextEditingController? tagContentController;

  final ProfilePageViewModel _profilePageViewModel = ProfilePageViewModel();

  @override
  void initState() {
    super.initState();
    tagContentController = TextEditingController();
    _profilePageViewModel.fetchTagList();
    _profilePageViewModel.fetchUserName();
  }

  @override
  void dispose() {
    super.dispose();
    tagContentController?.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<ProfilePageViewModel>(
      create: (_) => _profilePageViewModel,
      child: Consumer<ProfilePageViewModel>(builder: (context, notifier, _) {
        return ProgressWidget(
          loading: notifier.isLoading,
          msg: S.of(context).isLoading,
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              SizedBox(
                width: SizeConfig.getProportionateScreenWidth(327.0),
                child: Column(
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.end,
                      children: [
                        Padding(
                          padding: const EdgeInsets.only(top: 54.0),
                          child: Container(
                            width:
                                SizeConfig.getProportionateScreenHeight(48.0),
                            height:
                                SizeConfig.getProportionateScreenHeight(48.0),
                            padding: const EdgeInsets.all(13.75),
                            decoration: const BoxDecoration(
                              color: Colors.white,
                              borderRadius: BorderRadius.all(
                                Radius.circular(14.0),
                              ),
                            ),
                            child: CupertinoPopupMenu(
                              borderShape: const RoundedRectangleBorder(
                                borderRadius: BorderRadius.all(
                                  Radius.circular(12.0),
                                ),
                              ),
                              offset: const Offset(10.0, 30.0),
                              onSelected: (value) {
                                if (value == "logout") {
                                  UserService.logout(context);
                                } else if (value == "settings") {
                                  Navigator.pushNamed(context, SettingPage.id);
                                }
                              },
                              child: Container(
                                decoration: BoxDecoration(
                                  border: Border.all(
                                    color: textColor,
                                    width: 1.5,
                                  ),
                                  borderRadius: const BorderRadius.all(
                                    Radius.circular(4.0),
                                  ),
                                ),
                                child: const Icon(
                                  Icons.more_horiz_outlined,
                                  size: 15.5,
                                ),
                              ),
                              itemBuilder: (BuildContext context) => [
                                PopupMenuItem(
                                  value: "settings",
                                  child: Row(
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: <Widget>[
                                      Text(
                                        S.of(context).settings,
                                        style: Theme.of(context)
                                            .textTheme
                                            .bodyText2,
                                      ),
                                      Icon(
                                        Icons.settings,
                                        color: Theme.of(context)
                                            .textTheme
                                            .bodyText2
                                            ?.color,
                                        size:
                                            SizeConfig.getProportionateFontSize(
                                                20.0),
                                      ),
                                    ],
                                  ),
                                ),
                                PopupMenuItem(
                                  value: "logout",
                                  child: Row(
                                    mainAxisAlignment:
                                        MainAxisAlignment.spaceBetween,
                                    children: <Widget>[
                                      Text(
                                        S.of(context).logout,
                                        style: Theme.of(context)
                                            .textTheme
                                            .bodyText2,
                                      ),
                                      Icon(
                                        Icons.logout,
                                        color: Theme.of(context)
                                            .textTheme
                                            .bodyText2
                                            ?.color,
                                        size:
                                            SizeConfig.getProportionateFontSize(
                                                20.0),
                                      ),
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ),
                      ],
                    ),
                    // CircleAvatar(
                    //   radius: SizeConfig.getProportionateScreenHeight(39.0),
                    //   backgroundColor: Colors.white,
                    //   child: const Image(
                    //     image: AssetImage("assets/images/face.png"),
                    //   ),
                    // ),
                    SizedBox(
                      height: SizeConfig.getProportionateScreenHeight(15.0),
                    ),
                    Text(
                      "${notifier.userName}",
                      style: Theme.of(context).textTheme.bodyText2?.copyWith(
                            fontSize: SizeConfig.getProportionateFontSize(20.0),
                          ),
                    ),
                    SizedBox(
                      height: SizeConfig.getProportionateScreenHeight(12.0),
                    ),
                    RefreshIndicator(
                      // onRefresh: generateTagList,
                      onRefresh: () async {
                        notifier.fetchTagList();
                        setState(() {});
                      },
                      child: Container(
                        child: notifier.tagList!.isEmpty
                            ? Center(
                                child: Padding(
                                  padding: EdgeInsets.only(
                                    top:
                                        SizeConfig.getProportionateScreenHeight(
                                            120.0),
                                  ),
                                  child: Text(
                                    S.of(context).noData,
                                    style: TextStyle(
                                      fontSize:
                                          SizeConfig.getProportionateFontSize(
                                              20.0),
                                    ),
                                  ),
                                ),
                              )
                            : LabelTypeGroup(
                                height: SizeConfig.getProportionateScreenHeight(
                                    570.0),
                                labelTypeList:
                                    ProfilePageService.generateTagList(
                                        context, notifier.tagList),
                              ),
                      ),
                    )
                  ],
                ),
              )
            ],
          ),
        );
      }
          // child: ,
          ),
    );
  }
}
